// 真正创建节点  , vnode创建为DOM ，是孤儿节点不进行插入
export default function createElement(vnode) {
  // 把虚拟节点插入

  // 创建 DMO 元素
  const domNode = document.createElement(vnode.sel);
  // 是文本还是子节点
  if (vnode.text !== "" && (!vnode.childern || !vnode.childern.length)) {
    console.log("创建dom是文本");
    // 是文本
    domNode.innerText = vnode.text;

    // 是一个数组，并且数组是有长度的
  } else if (Array.isArray(vnode.childern) && vnode.childern.length > 0) {
    // 是数组说明内部是子节点 那么需要递归创建节点
    for (let i = 0; i < vnode.childern.length; i++) {
      const ch = vnode.childern[i];
      // 创建出它的DOM 一旦调用createElement 意味着 : 创建出了DOM了 并且它的elm属性指向了
      // 创建出的DOM 但是还没有上树，是一个孤儿节点
      const chDom = createElement(ch);
      domNode.appendChild(chDom);
    }
  }
  // 补充elm属性
  vnode.elm = domNode;

  // 返回 elm elm 属性是一个纯DOM对象
  return vnode.elm;
}
